@import '@/styles/variables.scss';

.header {
  background-color: $white-color;

  .consumer_card {
    position: relative;
    background: url('@/static/header_bg.png') center center/cover no-repeat;
    height: 100px;
  }
  .consumer {
    position: absolute;
    left: 0;
    bottom: -30px;
    right: 0;
    padding: 0 map-get($spaces, sm);

    .username {
      font-size: map-get($font-sizes, md);
      font-weight: bold;
      line-height: 1.6;
      color: #323233;
    }
    .phone {
      font-size: map-get($font-sizes, sm);
      line-height: 1.6;
      color: #666666;
    }
  }
}

.menu {
  border-radius: $radius;
  text-align: center;
  background: $white-color;
  padding: calc($space / 2);
  box-shadow: 0px 0px 5px rgba(map-get($border-colors, lighter), 0.4);
  // border: solid 1px map-get($border-colors, lighter );
  .menu-icon {
    font-size: 24px;
  }
  .menu-name {
    line-height: 1.2;
    margin-top: map-get($spaces, xs);
  }
}

